<!DOCTYPE HTML>
{% load i18n static main_tag %}
{% get_current_language as LANGUAGE_CODE %}
<html>
<head>
    <title>{% block title %}{{ order_info.order_code }}-contract{% endblock %}</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <link rel="shortcut icon" href="{% static 'main/favicon.ico' %}">
    <meta name="keywords" content="">
    <style type="text/css">
        html {
            width: 100%;
        }

        body {
            font-family: 'Open Sans', sans-serif;
            font-size: 13px;
            width: 100%;
            text-align: left;
        }

        .page {
            width: 660px;
            margin-top: 0;
            margin-bottom: 0;
            margin-right: auto;
            margin-left: auto;
            background-color: #ffffff;
            padding-top: 30px;
            padding-bottom: 30px;
            padding-right: 40px;
            padding-left: 40px;
        }

        .container {
            width: 100%;
        }

        h2 {
            text-align: center;
            font-size: 30px;
        }

        th {
            font-size: 14.5px;
        }

        table {
            width: 100%;
            border-collapse:collapse;
            /* background-color: #b6306e; */
            /* width: 660px; */
        }


        table.equipment_list_contract tbody tr.list_header th{
            background-color: #63B8FF;
            text-align: center;
        }

        table.equipment_list_contract th, table.equipment_list_contract td {
            border: solid black;
            border-top-width:1px;
            border-right-width:1px;
            border-bottom-width:1px;
            border-left-width:1px;
            padding: 5px;
            font-size: 12px;
        }

    </style>{% if request.GET.v == 'page' %}
    <link href="{% static 'main/css/main.css' %}" rel="stylesheet">{% else %}
    <link href="{% static 'main/css/main-pdf.css' %}" rel="stylesheet">{% endif %}
</head>
<body>
    <div class="page">
        <div class="container">
            {% block page_header %}{% include 'main/page_header_invoice_en.html' %}{% endblock %}
            <hr style="width:100%; height:2px; border:none; border-top:2px solid #555555;" />
            <h3 style="text-align:center;">INVOICE</h3>
            <div class="row" style="height:10px;"></div>
            <table>
                <tbody>
                    <tr>
                        <td style="width:40px;"></td>
                        <td style="width:40px;">TO:</td>
                        <td>{{ order_info.client.company|default_if_none:'' }}</td>
                        <th valign="top" style="width:100px;text-align:right;">PI NO.:</th>
                        <td valign="top" style="width:130px;text-align:right;">{{ order_info.order_code }}</td>
                        <td style="width:40px;"></td>
                    </tr>
                    <tr>
                        <td></td>
                        <td>ATT:</td>
                        <td>{{ order_info.client.name }}</td>
                        <th valign="top" style="text-align:right;">Date:</th>
                        <td valign="top" style="text-align:right;">{{ print_date|date:"Y-m-d" }}</td>
                        <td></td>
                    </tr>
                    <tr>
                        <td colspan="6" height="20"></td>
                    </tr>
                    <tr>
                        <td colspan="6" style="">We hereby confirm having sold to you the following goods on the terms and conditions as set forth hereunder:</td>
                    </tr>
                </tbody>
            </table>
            <div class="row" style="height:20px;"></div>
            <table>
                <tbody>
                    <tr>
                        <th style="color:blue;text-align:right;">Current: {{ order_info.price_unit }}</th>
                    </tr>
                </tbody>
            </table>
            <table class="equipment_list_contract">
                <tbody>
                    <tr class="list_header">
                        <th>No.</th>
                        <th>Description & Specifications</th>
                        <th>Unit Price</th>
                        <th>Qty.</th>
                        <th>Extended Price</th>
                    </tr>{% for item in item_list %}
                    <tr>
                        <td style="width:30px;text-align:center;">{{ forloop.counter }}</td>
                        <td>{{ item.equipment.equipment_code }} / {{ item.equipment.equipment_en }}</td>
                        <td style="width:100px;text-align:right;">{{ item.item_price_each_auto }}</td>
                        <td style="width:60px;text-align:center;">{{ item.amount }}</td>
                        <td style="width:120px;text-align:right;">{{ item.item_final_price_auto }}</td>
                    </tr>{% endfor %}
                </tbody>
            </table>
            <table>
                <tbody>{% if order_info.transport_cost_auto %}
                    <tr>
                        <th style="text-align:right;">Transport Cost:</th>
                        <th style="width:120px;text-align:right;">+{{ order_info.transport_cost_auto }}</th>
                    </tr>{% endif %}{% if order_info.install_cost_auto %}
                    <tr>
                        <th style="text-align:right;">Installation Cost:</th>
                        <th style="width:120px;text-align:right;">+{{ order_info.install_cost_auto }}</th>
                    </tr>{% endif %}{% if order_info.material_cost_auto %}
                    <tr>
                        <th style="text-align:right;">Installation Materials Cost:</th>
                        <th style="width:120px;text-align:right;">+{{ order_info.material_cost_auto }}</th>
                    </tr>{% endif %}
                    {% if extra_discount > 0 %}
                    <tr>
                        <th style="text-align:right;">Extra Discount:</th>
                        <th style="width:120px;text-align:right;"><font color="red">-{{ extra_discount_auto }}</font></th>
                    </tr>{% endif %}
                    {% if order_info.tax_rate > 0 %}
                    <tr>
                        <th style="text-align:right;">Tax (+{{ order_info.tax_rate }}%):</th>
                        <th style="width:120px;text-align:right;">+{{ price_tax_auto }}</th>
                    </tr>{% endif %}
                    <tr>
                        <th style="text-align:right;">Total:  </th>
                        <th style="width:120px;text-align:right;">{{ price_with_tax_auto }}</th>
                    </tr>
                </tbody>
            </table>
            <div class="row" style="height:30px;"></div>
            <table>
                <tbody>
                    <tr>
                        <td colspan="3">Payment: {{ order_info.order_pay_method.pay_method_en }}</td>
                    </tr>
                    <tr>
                        <td colspan="3">Delivery: {{ order_info.transport_type.transport_en }}</td>
                    </tr>
                    <tr>
                        <th colspan="3">Beneficiary Bank Information:</th>
                    </tr>
                    <tr>
                        <td style="width:20px;"></td><td style="width:170px;">Beneficiary's Name:</td><td><font size="2">{{ order_info.bank_account.beneficiary_name_en }}</font></td>
                    </tr>
                    <tr>
                        <td></td><td>Account No.:</td><td><font size="2">{{ order_info.bank_account.bank_account }}</font></td>
                    </tr>
                    <tr>
                        <td></td><td>Swift Code:</td><td><font size="2">{{ order_info.bank_account.swift_code }}</font></td>
                    </tr>
                    <tr>
                        <td></td><td>Bank Name:</td><td><font size="2">{{ order_info.bank_account.bank_en }}</font></td>
                    </tr>
                    <tr>
                        <td></td><td>Bank Address:</td><td><font size="2">{{ order_info.bank_account.bank_address_en }}</font></td>
                    </tr>
                    <tr>
                        <td></td><td>Beneficiary's Address:</td><td><font size="2">{{ order_info.bank_account.beneficiary_address_en }}</font></td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
<div class="footer" align="center">
    <p></p>
</div>
</body>
</html>

